<template>
  <component :is="componentId"></component>
</template>

<script>
import ui1920 from "./ui/1920";
import ui1366 from "./ui/1366";
export default {
  name: "",
  components: {
    ui1920,
    ui1366
  },
  data() {
    return {
      componentId: "ui1920"
    };
  },
  created() {
    this.watchResize()
  },
  mounted() {
    window.addEventListener("resize", this.watchResize);
    this.$once("hook:beforeDestroy",()=>{
       window.removeEventListener("resize",this.watchResize)
    })
  },
  methods: {
    watchResize(val) {
      if(document.documentElement.clientWidth>1366){
        this.componentId='ui1920'
      }else{
        
        this.componentId='ui1366'
      }
    }
  }
};
</script>

<style>
.el-radio{
  /* padding:10px!important; */
  display:flex;
}
</style>
